<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<h1>因为不是实时的，所以局限。IE8以下不支持</h1>
		<h3>querySelector--------只能选单个</h3>
		<div id="aaa">
			<p>
				<span class="aaa">111111</span>
				<span class="aaa">111111</span>
			</p>
		</div>
		
		<script type="text/javascript">
			var aaa = document.querySelector('#aaa p .aaa')
			aaa.innerHTML = 2222222222
		</script>
		
		
		<hr />
		
		
		
		
		
		<h3>querySelectorAll--------选的是多个</h3>
		<div id="bbb">
			<p>
				<span class="bbb">111111111111</span>
				<span class="bbb">111111111111</span>
				<span class="bbb">111111111111</span>
			</p>
		</div>
		<script type="text/javascript">
			var bbb = document.querySelectorAll('#bbb p .bbb')
			bbb[0].innerHTML = 222222
		</script>
	</body>
</html>